<template>
  <!-- 暂无数据 -->
  <div
    class="noData"
    :style="noDataObj.style"
  >
    <div class="img">
      <img :src="noDataObj.imgUrl">
    </div>
    <div class="cont">
      <slot>{{ noDataObj.cont }}</slot>
    </div>
  </div>
</template>

<script>
export default {
  props: {
    noDataObj: {
      type: Object,
      default: () => {
        return {
          imgUrl: require('@/assets/images/nodata.png'),
          cont: '暂无数据'
        }
      }
    }
  }
}
</script>

<style lang="less" scoped>
.noData {
  .img {
    width: 19rem;
    height: 13rem;
    margin: 0 auto;
    img {
      width: 100%;
    }
  }
  .cont {
    font-size: 1.4rem;
    color: #999999;
    text-align: center;
    line-height: 2rem;
    padding: 2rem 0;
  }
}
</style>
